<template> 
  <div class="container" :class="$store.state.app.collapse?'menu-bar-collapse-width':'menu-bar-width'">
    <bread-crumb></bread-crumb>
    <tagsview></tagsview>
    <!-- 缓存页面 -->
    <keep-alive exclude="AddStudent,AddSchool,AddMyStudent,AddChinaedu,AddXuecoo,EditXuecoo,EditStudent,EditSchool,EditChinaedu,SeeSchoolfile,MarketingCalendarFile,MarketingCalendarConfig,MarketingCalendar,MaterialPackageEidtPop,NewMessage">
        <router-view   class="content" :key="$route.fullPath"></router-view>
    </keep-alive>
  
    <!-- <router-view   class="content" ></router-view> -->
  
  </div>
</template>

<script>
import BreadCrumb from "@/components/BreadCrumb";
import tagsview from "@/components/tagsview";
import Cookies from "js-cookie";
import axios from "axios";
export default {
  components: {
    BreadCrumb,
    tagsview
  },
  provide() {
    return {
      reload: this.reload
    };
  },
  data() {
    return {
      instance: "",
      isRouterAlive: true,
      isWsSuccess: true,
      // ws:new WebSocket(),
      userName:Cookies.get('webuser'),
      mqOptions:[],
      mqURL:'',
      mqUsername:'',
      mqPasswrod:''
    };
  },
  methods: {
    onClick: function() {
      this.$router.push("/MessageManagement/PublicMessage");
      this.instance.close();
    },
    getMessage() {
      this.$api.message.getMessage().then(res => {
        if (res.result == 1) {
          if (res.messageNumber) {
            this.$notify.closeAll();
            const h = this.$createElement;
            let message = "您有" + res.messageNumber + "条新消息，";
            this.instance = this.$notify({
              title: "提示",
              position: "bottom-right",
              message: h("p", null, [
                h("span", null, message),
                h(
                  "button",
                  {
                    on: {
                      click: this.onClick
                    }
                  },
                  "点击我查看"
                )
              ]),
              duration: 0
            });
          }
        }
      });
    },
    // 获取mqPEIZHI 
    get_MQ(){
      this.$api.user.optionsList({codeType: "mq_config"}).then(res=>{
          this.mqOptions=res.keyValueList
      })
    },
    // 初始化ws
    ws1() {
      var _this = this;
      // 获取MQ配置
      _this.$api.user.optionsList({codeType: "mq_config"}).then(res=>{
          _this.mqOptions=res.keyValueList
          _this.mqOptions.forEach(item=>{
        if(item.key=='url'){
          _this.mqURL=item.value
        }
        if(item.key=="uer_name"){
          _this.mqUsername=item.value
        }
        if(item.key=="password"){
          _this.mqPasswrod=item.value
        }
      })
      
      
      const ws=new WebSocket(_this.mqURL)
      _this.ws=ws
      // 初始化 ws 对象
      // const ws = new WebSocket("ws://172.16.9.112:15674/ws");
      // 获得Stomp client对象
      const client = Stomp.over(ws);
      // 定义连接成功回调函数
      const on_connect = function(x) {
        //data.body是接收到的数据
        client.subscribe("/queue/" + _this.userName, function(data) {
          const msg = JSON.parse(data.body)
          // _this.$alert(msg, "来自系统消息", {
          //   confirmButtonText: "确定"
          //   // callback: action => {
          //   //   _this.$message({
          //   //     type: 'info',
          //   //     message: ``
          //   //   });
          //   // }
          // });
          _this.$notify({
            title: msg.messageTitle,
            message: msg.messageContent,
            duration: 3000,
            position:'bottom-right'
          });
        });
      };
      // 定义错误时回调函数
      const on_error = function() {
        // 如果连接MQ失败，就直接获取消息
        
        // let user = Cookies.get("webuser");
        // setInterval(() => {
        //   if (user) {
        //     _this.getMessage();
        //   }
        // }, 300000);
      };
      // 连接RabbitMQ
      client.connect(
        _this.mqUsername,
        _this.mqPasswrod,
        on_connect,
        on_error,
        "/"
      );
      })
    
      
    },
  },

  created() {},
  mounted() {
    let user = Cookies.get("webuser");
    if(user){
      this.ws1();
    }
  },
  destroyed(){
    // 关闭websocket连接
    this.ws.close()
  }
};
</script>

<style scoped lang="scss">
.container {
  position: absolute;
  top: 60px;
  left: 0px;
  // background: rgba(202, 243, 227, 0.1);

  .breadcrumb {
    padding: 10px;
    border-color: rgba(148, 145, 147, 0.2);
    border-bottom-width: 1px;
    border-bottom-style: solid;
  }
  .content {
    margin-bottom: 5px;
    padding-top: 5px;
    margin-left: 2px;
    margin-top: 15px !important;
    // background: rgba(209, 212, 212, 0.1);
  }
}
.menu-bar-width {
  left: 250px;
}
.menu-bar-collapse-width {
  left: 65px;
}
</style>
